<script type="text/javascript">
$(document).ready(function(){
	
	
	var maxStageNo = {$maxStageNo};
	var nextStageNo = maxStageNo + 1;
	var prevStageNo = maxStageNo - 1;
  //$("#"+maxStageNo).before("<tbody id='horseImageStart'>");	
  //$("#1").after("</tbody>");	
  if(maxStageNo >= 1)
  {
    $("#"+maxStageNo).html("<img src='images/icon.jpg' width='40px' height='40px' align='middle'>Stage "+maxStageNo);	
  }
  
  if(nextStageNo >= 2)
  {
    $("#"+nextStageNo).html("<img src='images/horse1.png' width='40px' height='40px' align='middle'>Stage "+nextStageNo);	
  }
  
  if(prevStageNo > 1)
  {
    $("#"+prevStageNo).html("<img src='images/horse1.png' width='40px' height='40px' align='middle'>Stage "+prevStageNo);	
  }
});
</script>

<!--<table align="center" border=1>
	<tr>
	  <th style=" color:#0071E1; background-color:#9FFF9F;" colspan="3">STAGE OF PROCESS LIST</th>
	</tr>
  <tr>
    <td class="text-field">CONTRACT NO</td>
    <td class="text-field">STAGE OF PROCESS</td>
    <td class="text-field">ACTION</td>
  </tr>
  {section name=sec loop=$processArrayList}
  <tr>
	  <td class="text-field">{$processArrayList[sec].contractNo}</td>
	  <td class="text-field">{$processArrayList[sec].stageProcessName}</td>
	  <td class="text-field">{$processArrayList[sec].action}</td>
  </tr>
  {/section}
</table>-->
<table border="0" border:0px; margin:0; padding:0; border-collapse:collapse;">
 <tr>
    <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
    <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
    <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
    <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
    <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
    <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
    <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
    <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
    <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
    <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
    <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
    <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
    <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
    <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
    <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
 </tr>
 <tr>
    <td colspan="14"></td>
    <td><div id="15">Stage 15</div></td>
 </tr>
 <tr>
   <td colspan="13"></td>
   <td colspan="2"><div id="14">Stage 14</div></td>
 </tr>
 <tr>
   <td colspan="12"></td>
   <td colspan="3"><div id="13">Stage 13</div></td>
 </tr>
 <tr>
   <td colspan="11"></td>
   <td colspan="4"><div id="12">Stage 12</div></td>
 </tr>
 <tr>
   <td colspan="10"></td>
   <td colspan="5"><div id="11">Stage 11</div></td>
 </tr>
 <tr>
   <td colspan="9"></td>
   <td colspan="6"><div id="10">Stage 10</div></td>
 </tr>
 <tr>
   <td colspan="8"></td>
   <td colspan="7"><div id="9">Stage 9</div></td>
 </tr>
 <tr>
   <td colspan="7"></td>
   <td colspan="8"><div id="8">Stage 8</div></td>
 </tr>
 <tr>
   <td colspan="6"></td>
   <td colspan="9"><div id="7">Stage 7</div></td>
 </tr>
 <tr>
 	 <td colspan="5"></td>
   <td colspan="10"><div id="6">Stage 6</div></td>
 </tr>
 <tr>
 	 <td colspan="4"></td>
 	 <td colspan="11"><div id="5">Stage 5</div></td>
 </tr>
 <tr>
 	 <td colspan="3" align="right">&nbsp;</td>
 	 <td colspan="12"><div id="4">Stage 4</div></td>
 </tr>
 <tr>
 	 <td colspan="2"></td>
 	 <td colspan="13"><div id="3">Stage 3</div></td>
 </tr>
 <tr>
 	 <td></td>
 	 <td colspan="14"><div id="2">Stage 2</div></td>
 </tr>
 <tr>
 	 <td colspan="15"><div id="1">Stage 1</div></td>
 </tr>
</table>
